{% extends 'layout.html' %}

{% block body %}
  
  <!-- 作者 -->
  <div class="flex rounded-2xl bg-primary-100 my-8 p-4">
    <div class="mr-8">
        <img class="w-36 rounded-full" src="{{ url_for('static', filename='images/author1.png') }}" alt="">
    </div>
    <div class="">
        <div class="text-2xl">智绘工坊</div>
        <div class="text text-white">
            智绘工坊：创造艺术的未来。我们，智绘工坊团队，致力于将科技与艺术完美融合，以创造出令人惊叹的
            艺术作品和体验。在智绘工坊，我们坚信创意无极限。我们直面挑战，并用创新的智能绘画技术打破传统的束缚，
            为艺术家和创作者们开辟全新的创作领域。我们的使命是利用智能技术的力量，为艺术家提供强大而灵活的工具，
            激发他们的创造力。 通过我们的创新产品和服务，他们可以表现自己的独特视角，呈现出令人叹为观止的艺术作品。
        </div>
    </div>
  </div>
  <!-- 功能区 -->
  <div class="border_line pb-12">
      <div class="text-white text-4xl pb-6">
          Coding ️️🧑🏽‍💻
      </div>
      <div class="grid grid-cols-4 gap-4">
          <!-- AI写代码 -->
          <div class="card">
              <a href="/write_code" class="flex h-full w-full  hover:bg-gray-800">
                  <div class="flex items-center my-8 px-6">
                      <div class="w-[50px] h-[50px] mr-4">
                          <img class="w-full" src="{{ url_for('static', filename='images/code.png') }}"  alt="">
                      </div>
                      <div class="flex-1">
                          <div class="text-lg">AI写代码</div>
                          <div class="text-sm">输入功能,AI帮你写代码.</div>
                      </div>
                  </div>
              </a>
          </div>

          <!-- AI改Bug -->
          <div class="card">
              <a href="/debug" class="flex h-full w-full  hover:bg-gray-800">
                  <div class="flex items-center my-8 px-6">
                      <div class="w-[50px] h-[50px] mr-4">
                          <img class="w-full" src="{{ url_for('static', filename='images/debugger.png') }}"  alt="">
                      </div>
                      <div class="flex-1">
                          <div class="text-lg">AI改Bug</div>
                          <div class="text-sm">AI帮你改Bug,生成修复后的代码，查看对比</div>
                      </div>
                  </div>
              </a>
          </div>
          <!-- AI创建图片 -->
          <div class="card">
              <a href="/create_img" class="flex h-full w-full  hover:bg-gray-800">
                  <div class="flex items-center my-8 px-6">
                      <div class="w-[50px] h-[50px] mr-4">
                          <img class="w-full" src="{{ url_for('static', filename='images/create_img.png') }}"  alt="">
                      </div>
                      <div class="flex-1">
                          <div class="text-lg">AI作画</div>
                          <div class="text-sm">输入关键词,AI帮你作画.</div>
                      </div>
                  </div>
              </a>
          </div>


          <!-- 更多功能 -->
          <div class="card">
              <a href="/create_img" class="flex h-full w-full  hover:bg-gray-800">
                  <div class="flex items-center my-8 px-6">
                      <div class="w-[50px] h-[50px] mr-4">
                          <img class="w-full" src="{{ url_for('static', filename='images/more.png') }}"  alt="">
                      </div>
                      <div class="flex-1">
                          <div class="text-lg">AI更多功能扩展</div>
                          <div class="text-sm">结合自身需求，使用AI帮你来实现。</div>
                      </div>
                  </div>
              </a>
          </div>
          <div class="card">
              <a href="/create_img" class="flex h-full w-full  hover:bg-gray-800">
                  <div class="flex items-center my-8 px-6">
                      <div class="w-[50px] h-[50px] mr-4">
                          <img class="w-full" src="{{ url_for('static', filename='images/more.png') }}"  alt="">
                      </div>
                      <div class="flex-1">
                          <div class="text-lg">AI更多功能扩展</div>
                          <div class="text-sm">结合自身需求，使用AI帮你来实现。</div>
                      </div>
                  </div>
              </a>
          </div>
          <div class="card">
              <a href="/create_img" class="flex h-full w-full  hover:bg-gray-800">
                  <div class="flex items-center my-8 px-6">
                      <div class="w-[50px] h-[50px] mr-4">
                          <img class="w-full" src="{{ url_for('static', filename='images/more.png') }}"  alt="">
                      </div>
                      <div class="flex-1">
                          <div class="text-lg">AI更多功能扩展</div>
                          <div class="text-sm">结合自身需求，使用AI帮你来实现。</div>
                      </div>
                  </div>
              </a>
          </div>
          <div class="card">
              <a href="/create_img" class="flex h-full w-full  hover:bg-gray-800">
                  <div class="flex items-center my-8 px-6">
                      <div class="w-[50px] h-[50px] mr-4">
                          <img class="w-full" src="{{ url_for('static', filename='images/more.png') }}"  alt="">
                      </div>
                      <div class="flex-1">
                          <div class="text-lg">AI更多功能扩展</div>
                          <div class="text-sm">结合自身需求，使用AI帮你来实现。</div>
                      </div>
                  </div>
              </a>
          </div>

          <div class="card">
              <a href="/create_img" class="flex h-full w-full  hover:bg-gray-800">
                  <div class="flex items-center my-8 px-6">
                      <div class="w-[50px] h-[50px] mr-4">
                          <img class="w-full" src="{{ url_for('static', filename='images/more.png') }}"  alt="">
                      </div>
                      <div class="flex-1">
                          <div class="text-lg">AI更多功能扩展</div>
                          <div class="text-sm">结合自身需求，使用AI帮你来实现。</div>
                      </div>
                  </div>
              </a>
          </div>

      </div>
  </div>


{% endblock %}